<template>
    <view><q-turntable ref="turntable" @start="turntableStart" @success="turntableSuccess"></q-turntable></view>
</template>

<script setup>
import { reactive, toRefs, ref } from 'vue';
const data = reactive({
    award: 1,
    awardList: [
        {
            title: '特等奖'
        },
        {
            title: '一等奖'
        },
        {
            title: '二等奖'
        },
        {
            title: '三等奖'
        },
        {
            title: '四等奖'
        },
        {
            title: '啥也没有'
        }
    ] // 顺时针对应每个奖项
});
const turntable = ref(null);
const { award, awardList } = toRefs(data);
// 用户点击开始抽奖
const turntableStart = () => {
    let index = Math.floor(Math.random() * 6 + 1);//前端随机数，这里应该后台返回中奖结果
    data.award = index;
    turntable.value.begin(data.award);
};

// 抽奖完成后操作
const turntableSuccess = () => {
    const index = data.award - 1;
    uni.showToast({
        title: `恭喜你获得${data.awardList[index].title}`,
        icon: 'none'
    });
};
</script>

<style>

</style>